#{extends 'include.html' /} 
#{set title:'SISAD - Sistema de Secretaria da Assembléia de Deus' /}

<head>
	<link rel="stylesheet" media="screen" href="@{'/public/stylesheets/main.css'}">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>

<script type="text/javascript">
	function voltar() {
		window.open("@{Calendarios.menuCalendario}", "_top");
	}

	function setarDatas(id){
		var data = document.getElementById("idCalendario_" + id).value;
		document.getElementById("anoInicio").value = data;
		document.getElementById("anoFinal").value = data;
	}

</script>

#{cabecalho/}
</br>

<body>
	
	#{if !calendarios.empty}
	<form action="@{Calendarios.cadastrarDados}" method="GET">
	
		<table class="subFormulario" align="center" style="width: 30%">
			<thead>
				<tr>
					<th colspan="4" align="center" width="">
						Cadastro de Dados do Calendário
					</th>
				</tr>
				<tr>
					<td width="30%">
						Calendário*:
					</td>
					<td colspan="4">
						#{list items: calendarios, as:'calendario'}
							<input type="radio" name="idCalendario" value="${calendario.id}" onclick="setarDatas(${calendario.id})"> ${calendario.nomeEvento} - ${calendario.ano}.${calendario.periodo} <br>
							<input type="hidden" id="idCalendario_${calendario.id}" value="${calendario.ano}">
						#{/list}
					</td>
				</tr>
			</thead>
			<tbody align="left">
				<tr>
					<td> Denominacao*: </td>
					<td colspan="4"> <input type="text" name="denominacao" size="40"/> </td>
				</tr>
				<tr>
					<td>
						Período Inicial*:
					</td>
					<td width="1%">
						<input type="text" id="diaInicio" name="diaInicio" size="2"  maxlength="2"/>
					</td>
					<td width="1%">
						<select id="mesInicio" name="mesInicio">
							<option value="1">Janeiro</option>
							<option value="2">Fervereiro</option>
							<option value="3">Marco</option>
							<option value="4">Abril</option>
							<option value="5">Maio</option>
							<option value="6">Junho</option>
							<option value="7">Julho</option>
							<option value="8">Agosto</option>
							<option value="9">Setembro</option>
							<option value="10">Outubro</option>
							<option value="11">Novembro</option>
							<option value="12">Dezembro</option>
						</select>
					</td>
					<td>
						<input type="hidden" id="anoInicio" name="anoInicio" size="5"  maxlength="4"/>
					</td>
				</tr>
				<tr>
					<td>
						Período Final*:
					</td>
					<td>
						<input type="text" id="diaFinal" name="diaFinal" size="2"  maxlength="2"/>
					</td>
					<td>
						<select id="mesFinal" name="mesFinal">
							<option value="1">Janeiro</option>
							<option value="2">Fervereiro</option>
							<option value="3">Marco</option>
							<option value="4">Abril</option>
							<option value="5">Maio</option>
							<option value="6">Junho</option>
							<option value="7">Julho</option>
							<option value="8">Agosto</option>
							<option value="9">Setembro</option>
							<option value="10">Outubro</option>
							<option value="11">Novembro</option>
							<option value="12">Dezembro</option>
						</select>
					</td>
					<td>
						<input type="hidden" id="anoFinal" name="anoFinal" size="5"  maxlength="4"/>
					</td>
				</tr>
			
			</tbody>
			
			<tfoot align="center">
				<tr>
					<td colspan="4">
						<input type="submit" value="cadastrar"/>
						<input type="button" value="voltar" onclick="voltar()"/>
					</td>
				</tr>
			</tfoot>
		</table>
	</form>
	#{/if}
	
	#{if calendarios.empty}
		<div align="center">
			<p style="color: red;"> Nenhum Calendário cadastrado no sistema. </p> </br>
			<input type="button" value="voltar" onclick="voltar()"/>
		</div>
	#{/if}
	
	</br>	
	
	#{if !listaDados.empty}
	<table width="40%" align="center">
		<thead>
			<tr style="background-color: #336; color: #FFF; font-weight: bold; font-size: 0.8em;">
				<th align="center" colspan="2"> 
					${nomeEvento}_${ano}.${periodo}
				</th>
			</tr>
			
			#{list items: listaDados, as:'dados'}
				<tr>
					<td align="right" width="50%">
						${dados.denominacao} :
					</td>
					<td align="left" width="50%">
						de 
						<b> ${dados.diaInicio}/${meses[dados.mesInicio - 1]} </b>  
						até 
						<b> ${dados.diaFim}/${meses[dados.mesFim - 1]} </b> 
				</tr>
			#{/list}
		</thead>
	</table>
	#{/if}

</body>

#{rodape/}